class Checkbox{
  constructor({innerText, container}) {
    this.innerText = innerText
    this.container = container
    this.init()
    this.addEvent()
    this.insertDom()
  }

  init() {
    let alabel = document.createElement('label')
    let aspan = document.createElement('span')
    let ainput = document.createElement('input')
    aspan.classList.add('check-area')
    ainput.setAttribute('type', 'checkbox')
    let text = document.createElement('span')
    text.innerText = this.innerText
    alabel.appendChild(aspan)
    alabel.appendChild(ainput)
    alabel.appendChild(text)
    this.alabel = alabel
    this.ainput = ainput
  }
  addEvent() {
    this.ainput.addEventListener('click', this.handleClick.bind(this), false)
  }

  handleClick(e) {
    let checkStatus = e.target.checked
    this.alabel.classList[checkStatus ? 'add': 'remove']('has-checked')
  }

  insertDom() {
    document.getElementById(this.container).appendChild(this.alabel)
  }
}